<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: header('流程定义列表')" />
	<th:block th:include="include :: list-css" />
</head>
<body>
	<div class="main-content">
		<div class="content-right">
			<div class="search-top">
				<span>查询条件</span>
				<a href="javascript:;" layadmin-event="flexible" class="menuBtn">
					<i class="layui-icon layui-icon-spread-left" id="LAY_app_flexible" style="color: #fff;"></i>
				</a>
			</div>
			<div class="panel layout-expand layui-expand-east">
			    <div class="panel-header">
			        <div class="panel-tool" style="text-align: center; width: 26px;height: 30px;line-height: 30px;">
			            <a href="javascript:;" layadmin-event="flexible" class="menuBtn">
			                <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible" style="color: #fff;"></i>
			            </a>
			        </div>
			    </div>
			    <div class="panel-body panel-title" style="text-align: center; width: 26px;">查<br>询<br>条<br>件</div>
			</div>
	       	<form class="layui-form">
				<th:block th:include="listinclude :: searchRight('page')" />
			</form>
	   	</div>
	    <div class="mid-content">
	        <table class="layui-hide" id="dhtable" lay-filter="ftable"></table>
	    </div>
	</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: searchJS" />
<th:block th:include="listinclude :: list-templeat" />
<script type="text/html" id="toolbar">
	<div class="layui-btn-container">
		<div class="layui-btn layui-table-tools importbtn-bg" lay-event="addbtn" id="uploadDef" shiro:hasPermission="flowable:definition:add">
			<i class="dhicon dh-upload"></i> 部署流程文件</i>
		</div>
	</div>
</script>
<script type="text/html" id="barDh">
	 {{# if(d.status == 1){ }}
	 <a class="layui-btn layui-btn-xs layui-btn-danger  dhicon dh-pause" style="background: brown" lay-event="updateStatus"  shiro:hasPermission="flowable:definition:edit"> 挂起</a>
	 {{# }if(d.status == 0){ }}
	 <a class="layui-btn layui-btn-xs dhicon dh-play"  lay-event="updateStatus"  shiro:hasPermission="flowable:definition:edit"> 激活</a>
	 {{# } }}
	<a class="layui-btn layui-btn-xs dhicon dh-play-circle-o layui-btn-normal" lay-event="convertToModel"  shiro:hasPermission="flowable:definition:edit"> 转模型</a>
	<a class="layui-btn layui-btn-xs layui-btn-danger  dhicon dh-remove" lay-event="delete" shiro:hasPermission="flowable:definition:delete"> 删除</a>
    <a class="layui-btn layui-btn-xs dhicon dh-search layui-btn-warm" lay-event="flowsheet"  shiro:hasPermission="flowable:definition:view"> 流程图</a>
</script>
<script type="text/html" id="templet_status">
{{# if(d.status == 1){ }}
	 已激活
{{# }else{ }}
	 <span style='color:red'>已挂起</span>
{{# } }}
</script>
<script type="text/html" id="templet_version">
	v.{{d.version}}
</script>
<script th:inline="javascript">
	/*<![CDATA[*/
	var prefix = ctx + "flowable/definition";
    var gridColumns=[[${gridColumns}]];
    var moduleTable=[[${moduleTable}]];
	/*]]>*/
</script>
<script type="text/javascript">
var $,layer,form,table,laydate,upload;
var wherestr={};
layui.use(['laydate', 'table','form','layer','jquery','upload'], function () {
	$ = layui.$,layer = layui.layer,form = layui.form,table = layui.table,laydate = layui.laydate,upload = layui.upload;
	serachRender();//查询条件初始渲染集合
	$.tablelist.init({
		elem: '#dhtable'
		,modalName: "流程定义"
		,createUrl: prefix + "/add"
		,url: prefix + "/list"
		,where: {field: 'deploymentTime',order: 'desc'}
		,sort:true
		,cols: [gridColumns.gridBody
		]
		,toolbar: '#toolbar'
		,defaultToolbar: [{title:'列设置',layEvent: 'fieldSet',icon: 'layui-icon-set'}]
		,height:'full-36',
	});
	initAddfile();
	//监听工具条
	table.on('tool(ftable)', function (obj) {
		var data = obj.data;
		if (obj.event === 'convertToModel') {
			var proDefId = data.id;
			$.modal.confirmCom("您确认要转化流程[" + data.name +"]为模型？", function () {
				$.operate.post(prefix + "/convertToModel", {proDefId:proDefId},function(result){
					if (result.code == "0"){
						$.modal.msgSuccess(result.msg);
					}else {
						$.modal.msgError(result.msg);
					}
				});
			});
		}else if(obj.event === 'delete'){ //删除
			$.modal.confirmCom("您确认要删除流程[" + data.name +']？',function(){
				$.operate.post(prefix + "/delete",{depId:data.deploymentId,id:data.id},function(result){
					allReload(result)
				});
			});
		}else if(obj.event === 'updateStatus'){ //更新状态
			var status = data.status;
			var title = (status == "1") ? "您确认要暂停挂起流程[" + data.name + "]？":"您确认要激活运行流程["+data.name+ "]？";
			var newStatus = (status == "1") ? 0 : 1;
			$.modal.confirmCom(title,function(){
				$.operate.post(prefix + "/updateStatus",{'proDefId':data.id, status:newStatus},function(result){
					allReload(result)
				});
			});
		}else if(obj.event === 'flowsheet'){ //流程图
			var width = 800;
			var height = ($(window).height() - 150);
			var url = prefix + "/flowsheetbyid?procDefId=" + data.id;
			layer.open({
				type: 2,
				area: [width + 'px', height + 'px'],
				offset: '10%',//距离顶部10%
				fix: false,
				//不固定
				maxmin: true,
				shade: 0.6,
				title: "流程图",
				content:  url,
				btn: ['关闭'],
				//点击弹层外区域关闭
				shadeClose: true,
				cancel: function(index) {
					return true;
				}
			});
		}
	});
	//头工具栏事件
	table.on('toolbar(ftable)', function(obj){
    	switch(obj.event){
      	case 'fieldSet':
    		filedSet(moduleTable);
    		break;
    	};
	});
	//监听排序事件
	table.on('sort(ftable)', function(obj){
		$.tablelist.sort('dhtable',obj);
	});

})
function initAddfile(){
	upload.render({ //允许上传的文件后缀
		elem: '#uploadDef'
		,url: prefix +'/deployByFile'
		,accept: 'file' //普通文件
		,field:'processDefinition'
		,done: function(res){
			if (res.code == "0"){
				$.modal.msgSuccess(res.msg);
				allReload(res);
			}else {
				$.modal.msgError(res.msg);
			}
		},error: function(){
			$.modal.msgError("上传部署流程文件失败！");
		}
	})
}
//搜索按钮：重复监听（search.js），添加页面专属动作
$('#btn-search').on('click', function () {
	setTimeout(function(){
		initAddfile();
	}, 1000);
});
//重新加载
function allReload(result){
	if(result.code==0){
		setTimeout(function(){
			layer.closeAll();
			table.reload('dhtable', {url: prefix + "/list",page:{curr: 1}});
			initAddfile();
		}, 1000);
	}
};
</script>
</body>
</html>
